{extend name="public/menu2" /}
{block name='title'}-{$cur.name}{/block}

{block name='content'}
<!-- 简介 -->
<div class="right_content">
    <p class="cell_title">{$content[0]['title'] ?: ''}<span>:::</span></p>
    <div class="brief">
        <!-- start -->
        {$content[0]['content']['content']|raw|default=''}
        <!-- end -->
    </div>
</div>
</div>
<!-- 课程类型 -->
<div class="cell" id="curriculum_type">
    <div class="cell_content">
        <p class="cell_title">{$content[1]['title'] ?: ''}<span>:::</span></p>
        <ul class="list">
            {foreach $content[1]['content']['lists'] as $k=>$c}
            <li>
                <span class="tips">{$k+1}</span>
                <div>
                    <p class="title">{$c.title ?: ''}</p>
                    <p class="txt">{$c.content|raw|default=''}</p>
                </div>
            </li>
            {/foreach}
        </ul>
        <p class="image_box">
            {$content[1]['content']['content']|raw|default=''}
        </p>
    </div>
</div>
<!-- 课程特色 -->
<div class="cell" id="curriculum">
    <div class="cell_content">
        <p class="cell_title">{$content[2]['title'] ?: ''}<span>:::</span></p>
        <ul class="list">
            {foreach $content[2]['content'] as $k=>$c}
            <li>
                <span class="tips">{$k+1}</span>
                <div>
                    <p class="title">{$c.content.title ?: ''}</p>
                    <p class="txt">{$c.content.title2 ?: ''}</p>
                </div>
            </li>
            {/foreach}

        </ul>
    </div>
</div>
{/block}

{block name='script'}
<style>
    #content .brief {
        line-height: 2;
    }

    #content .cell {
        padding: 60px 0;
    }

    #content img {
        max-width: 100%;
    }

    #content .cell_content {
        box-sizing: border-box;
        margin: auto;
        padding-left: 150px;
        width: 1200px;
        line-height: 1.5;
        overflow: hidden;
    }

    #curriculum_type {
        background-color: #f0f0f0;
    }

    .cell .list {
        display: flex;
        flex-flow: row wrap;
        justify-content: space-between;
        width: 100%;
    }

    .cell li {
        box-sizing: border-box;
        margin: 25px 0;
        width: 510px;
        overflow: hidden;
        display: flex;
    }

    .cell li span {
        margin-right: 15px;
        width: 90px;
        height: 90px;
        line-height: 90px;
        font-size: 50px;
        text-align: center;
        color: #fff;
        position: relative;
        z-index: 1;
    }

    .cell div {
        flex: 1;
        overflow: hidden;
    }

    .cell li span::before {
        content: "";
        width: 60px;
        height: 60px;
        background-color: #8f000b;
        transform: rotate(45deg);
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto;
        z-index: -1;
    }

    .cell li .title {
        font-size: 20px;
        line-height: 1;
    }

    .cell li .txt {
        line-height: 1.7;
        color: #666;
    }
    .cell .image_box{
        text-align: center;
    }
    .cell .image_box img{
        max-width: 100%;
    }
</style>

{/block}